<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        html,body,ul,li,dl,dt,dd,p,h1,h2,h3,h4,h5,h6{margin: 0;padding: 0;}
        li{list-style: none}
        a{text-decoration: none;color: #000;}
        #header{
            height: 40px;
            background-color: #333;
            color: #ccc;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 20px;
        }
        #footer{
            height: 400px;
            background-color: #eee;
        }
    </style>
</head>
<body>
    <div id="header"></div>
    <div id="body"></div>
    <div id="footer"></div>
</body>
<script src="https://lib.baomitu.com/jquery/3.5.1/jquery.js"></script>
<script>

    $("#header").load("public/header.html");

    $("#body").load("home/body.html");

    $("#footer").load("public/footer.html");
    
</script>
</html>
